<template>
  <archiveLayout class="main__page" :current-page="page" :tabs="tabs" :total="totalCount" @current-change="currentChangeHandler" :title="layoutTitle">
    <archvieCard :index="index" :archive="temp" :key="index" v-for="(temp, index) in nowShowList">
      <el-button :disabled="temp.isAction" @click="examineComplete(temp,index)" size="mini" type="primary" plain>通过审核</el-button>
      <el-button :disabled="temp.isAction" @click="examineTurnDown(temp, index)" size="mini" style="margin-left:20px" type="danger" plain>拒绝审核</el-button>
    </archvieCard>
    <itemNoData text="暂时没有需要审核的稿件" v-if="isNoData" />
  </archiveLayout>
</template>

<script>
import archiveLayout from '@/components/ArchiveLayout/index.vue';
import itemNoData from '@/components/NoData/index.vue';
import archvieCard from '@/components/ArchiveCard/index.vue';
import { getArchiveExamineAPI, archiveExamineAPI } from '@/api/archive';

export default {
    components: {
        archiveLayout,
        archvieCard,
        itemNoData,
    },
    data() {
        return {
            isNoData: false,
            totalCount: 0,
            page: 1,
            size: 5,
            nowShowList: [],
            nowCheck: 0,
            tabs: [{ name: '待审核', count: 0 }],
        };
    },
    computed: {
        archiveType() {
            return this.$route.meta.archiveType;
        },
        layoutTitle() {
            return this.$route.meta.title;
        },
    },
    created() {
        this.main();
    },
    methods: {
        async main() {
            const data = await this.getArchiveListExamine();
            this.formatData(data);
        },
        // 获取审核列表
        async getArchiveListExamine() {
            const { data } = await getArchiveExamineAPI({
                type: this.archiveType,
                page: this.page,
                size: this.size,
            });
            return data;
        },
        // 统一验证参数方法
        verifyDataLength(data) {
            return data.archives.length === 0;
        },
        // 整理参数
        formatData(data) {
            if (this.verifyDataLength(data)) {
                this.isNoData = true;
                this.totalCount = 0;
                this.tabs[this.nowCheck].count = 0;
                this.nowShowList = [];
                return;
            }
            this.totalCount = data.examineDoingCount;
            this.tabs[this.nowCheck].count = data.examineDoingCount;
            this.nowShowList = data.archives.map((v) => {
                this.$set(v, 'isAction', false);
                return v;
            });
        },
        async currentChangeHandler(page) {
            this.page = page;
            const data = await this.getArchiveListExamine();
            this.formatData(data);
        },
        async archiveRemoveHandler() {
            let data = await this.getArchiveListExamine();
            if (this.verifyDataLength(data)) {
                this.page -= 1;
                if (this.page < 1) this.page = 1;
                data = await this.getArchiveListExamine();
            }
            this.formatData(data);
        },
        async examineComplete(element) {
            element.isAction = true;
            const { code, message } = await archiveExamineAPI({ aid: element.aid, type: this.archiveType, state: 2 });
            const isSuccess = code === 200;
            this.$message({ type: isSuccess ? 'success' : 'error', message });
            element.isAction = isSuccess;
            if (isSuccess) this.archiveRemoveHandler();
        },
        async examineTurnDown(element) {
            element.isAction = true;
            try {
                const { value } = await this.$prompt('请输入拒绝理由', '拒绝审核', { showCancelButton: false });
                const { code, message } = await archiveExamineAPI({ aid: element.aid, state: 3, mark: value });
                const isSuccess = code === 200;
                this.$message({ type: isSuccess ? 'success' : 'error', message });
                element.isAction = isSuccess;
                // eslint-disable-next-line no-throw-literal
                if (!isSuccess) throw 'fail';
                this.archiveRemoveHandler();
            } catch (error) {
                const foramtErr = { cancel: '取消操作', fail: '操作失败' };
                this.$message.error(foramtErr[error]);
                element.isAction = false;
            }
        },
    },
};
</script>
